/*
* peer-has 兄弟元素子元素选择器改变兄弟元素样式
* peer  兄弟元素添加peer选择器
* peer-has-[:checked]:text-white 添加peer的兄弟元素选择器的子元素是选中时，改变当前元素文字颜色为white
* */
export default function Page(){
  return (
    <div className={' p-10'}>
      <div className={'peer'}>
        <input type={'checkbox'}/>
      </div>
      <p className={'peer-has-[:checked]:text-amber-500'}>千里之行始于足下1</p>
      <p>千里之行始于足下2</p>
      <p>千里之行始于足下3</p>
      <p className={'peer-has-[:checked]:underline'}>千里之行始于足下4</p>
    </div>
  )
}
